<template>
  <div>
    <div>这是子组件</div>
    <div>parentData:{{ parentData }}</div>
    <div>money:{{ money }}</div>
    <button @click="callChangeData">调用祖父提供的方法</button>
  </div>
</template>

<script setup lang="ts">
import { inject } from 'vue'
const parentData = inject('parentData')
const money = inject('money')
const changeData = inject('changeData') as () => void
console.log('从祖父组件注入的数据：', parentData)
console.log('从祖父组件注入的money：', money)
console.log('调用changeData方法后，parentData：', parentData)
console.log('调用changeData方法后，money：', money)
const callChangeData = () => {
  changeData && changeData() // 调用祖父组件提供的方法
}
</script>

<style scoped></style>
